<template>
    <el-select v-model="driverId" filterable remote :loading="loading" placeholder="请选择司机"
      @visible-change="handleVisibleChange" @change="changeDriver" :remote-method="remoteMethod">
      <el-option v-for="item in list" :key="item.ID" :label="item.label" :value="item.ID">
      </el-option>
    </el-select>
  </template>
  
  <script>
  export default {
    props: {
      sign: {
        type: [String, Number],
        default: ''
      }
    },
    data() {
      return {
        octopus: this.$parent.$parent.octopus,
        driverId: null,
        list: [],
        loading: false
      }
    },
    methods: {
      handleVisibleChange(visible) {
        if(visible && this.list.length == 0) {
          this.loading = true;
          this.searchCat().then(res => {
            res.map(item => item.label = item.Code + '-' + item.RealName + '-' + item.Mobile)
            this.list = res
            this.loading = false
          })
        }
      },
  
      remoteMethod(key) {
        if(key) {
          const o = this
          this.list = []
          let queueList = []
          queueList.push(this.searchCat('Code', key))
          queueList.push(this.searchCat('RealName', key))
          queueList.push(this.searchCat('Mobile', key))
          Promise.all(queueList).then(queList => {
            queList.map(list => {
              if(list.length) {
                list.map(item => {
                  if(o.list.findIndex(oItem => oItem.ID == item.ID) == -1) {
                    item.label = item.Code + '-' + item.RealName + '-' + item.Mobile
                    o.list.push(item)
                  }
                })
              }
            })
          })
        } else {
          this.searchCat().then(res => {
            res.map(item => item.label = item.Code + '-' + item.RealName + '-' + item.Mobile)
            this.list = res
            this.loading = false
          })
        }
      },
      searchCat(type = 'all', value) {
        const o = this
        return new Promise((resolve, reject) => {
          let cellData = [
            {name: "ID"},	// ID
            {name: "RealName"},	// 真实名
            {name: "Code"},	// 工号
            {name: "Mobile"},	// 手机号
          ]
          if(type != 'all') {
            cellData.map(item => {
              if(item.name == type) {
                item.filterKey = 'like',
                item.filterValue = value
              }
            })
          }
          o.octopus.request.api.post(
            "/Octopus/Engine/List",
            {
              id: "1219",
              cellData,
            },
            function (data) {
              if (data.status.code == 200) {
                resolve(data.content.queryData)
              } else {
                o.octopus.tips.error(data);
                reject(data)
              }
            });
          })
      },
  
      changeDriver(e) {
        this.$emit('getDriverId', { sign: this.sign, id: e, data: this.list.find(item => item.ID == e) })
      }
    }
  }
  </script>
  
  <style scoped>
  
  </style>